
<template>
  <div class="scorddetail">
     <el-card>
       <el-form ref="form" :model="form" label-width="80px">
        <el-form-item label="学生姓名">
          <el-input v-model="form.name" style="width: 200px"></el-input>
        </el-form-item>
        <el-form-item label="性别">
            <el-select v-model="form.sex" placeholder="请选择" style="width:200px;">
                <el-option
                    v-for="item in option"
                    :key="item.sex"
                    :label="item.label"
                    :value="item.sex">
                </el-option>
            </el-select>
        </el-form-item>
        <el-form-item label="学院">
          <!-- <el-input v-model="form.college" style="width: 200px"></el-input> -->
          <el-select
              v-model="form.college"
              clearable
              placeholder="请选择学院"
              @change="getzhuan(form.college)"
              style="width: 200px"
            >
              <el-option v-for="item in school" :key="item.value" :label="item.label" :value="item.value"></el-option>
            </el-select>

        </el-form-item>
        <el-form-item label="专业">
          <!-- <el-input v-model="form.major" style="width: 200px"></el-input> -->
          <el-select
              v-model="form.major"
              clearable
              placeholder="请选择专业"
              style="width: 200px"
            >
              <el-option v-for="item in editMajorOptions" :key="item.id" :label="item.majorName" :value="item.majorName"></el-option>
            </el-select>
        </el-form-item>
        <el-form-item label="班级">
          <!-- <el-input v-model="form.classes" style="width: 200px"></el-input> -->
          <el-select
              v-model="form.classes"
              clearable
              placeholder="请选择班级"
              style="width: 200px"
            >
              <el-option v-for="item in classListData" :key="item.id" :label="item.className" :value="item.className"></el-option>
            </el-select>
        </el-form-item>
        <el-form-item label="学年学期">
          <!-- <el-input v-model="form.schoolYear" style="width: 200px"></el-input> -->
          <el-select
              v-model="form.schoolYear"
              clearable
              placeholder="请选择班级"
              style="width: 200px"
            >
              <el-option v-for="item in schoolYear"  :key="item.id" :label="item.schoolYearName" :value="item.schoolYearName"></el-option>
            </el-select>
        </el-form-item>
        <el-form-item label="学号">
          <el-input v-model="form.studentId" style="width: 200px" placeholder="请选择学号"></el-input>
        </el-form-item>
        <el-form-item label="成绩">
          <el-table :data="form.achievement" border style="width: 50%">
            <el-table-column label="科目">
              <template slot-scope="scope">
                <el-input type="text" v-model="scope.row.subject"></el-input>
              </template>
            </el-table-column>
            <el-table-column label="分数">
              <template slot-scope="scope">
                <el-input type="text" v-model="scope.row.fraction"></el-input>
              </template>
            </el-table-column>
            <el-table-column label="评分">
              <template slot-scope="scope">
                <el-input type="text" v-model="scope.row.score"></el-input>
              </template>
            </el-table-column>
            <el-table-column label="是否补考">
              <template slot-scope="scope">
                <el-input type="text" v-model="scope.row.makeUp"></el-input>
              </template>
            </el-table-column>
            
          </el-table>
          <el-button type="primary" @click="tianjia" style="position: absolute;top:0px;left:595px;">补录</el-button>
        </el-form-item>
        <el-form-item>
          <el-button type="info" @click="$router.go(-1)">关闭</el-button>
          
          <el-button type="primary" @click="editStudent">修改</el-button>
        </el-form-item>
      </el-form>
     </el-card>
  </div>
</template>
<script>
import { getStudentList ,editStudentApi } from "@/api/achievement/student";
import {
  majorListApi,
  colleageTreeDataApi,
} from "@/api/basics/teachingPlan.js";
import {
  getClassGradeListApi,
} from "@/api/basics/classGrade";
export default {
  data() {
    return {
      form: {
        achievement: [],
        releaseStatus:0,
        college:27,
        sex:''
      },
      option:[
        {sex:0,label:'男'},
        {sex:1,label:'女'},
        {sex:2,label:'未知'}
      ],
      editMajorOptions: [], // 专业下拉框
      editSeletOptions: "", // 院校下拉框
      school:[],
      classListData:[], // 班级列表名称
      schoolYear:[],
      sex:''
    };
  },
  mounted() {
    var id = this.$route.params.id
    getStudentList({id:id}).then(res=>{
        console.log(res);
        this.form = res.rows[0]
        this.form.sex = this.form.sex == 0 ?'男': (this.form.sex == 1 ? "女" : '未知')
    })
    // var arr2 = []
    // getGradeListApi({parentId:55}).then(res=>{
    //   console.log(res,'班级');
    //   this.classListData = res.rows
    //   res.rows.forEach(item=>{
    //     console.log(item,'班级------');
    //   })
    // })
     getClassGradeListApi({pageSize:10,pageNum:1}).then(res=>{
      console.log(res,'班级');
      this.classListData = res.rows
    })
    this.getScholl()
  },
  methods: {
    tianjia() {
      this.form.achievement.push({ subject: "", fraction: "" ,score:"",makeUp:""});
    },
    editStudent(){
      console.log(this.form);
      editStudentApi(this.form).then(res=>{
        console.log(res);
        if(res.code == 200){
            this.$message.success('修改成功')
            this.$router.go(-1)
        }else{
            this.$message.error('修改失败')
        }
      })
    },
    getScholl(){
      colleageTreeDataApi().then(res=>{
        console.log(res,'学院');
        var arr = [];
        
        res.data.forEach(item=>{
          console.log(item,'---------');
          arr.push({label:item.label,value:item.id.toString()})

        })
        this.school = arr
        console.log(this.school,'======');
      })
    },
    getzhuan(id){
      console.log(id);
      majorListApi({colleageId:id}).then(res=>{
        console.log(res,'所属专业');
        this.editMajorOptions = res.rows
      })
    }
  }
};
</script>
<style lang="scss" scoped>
.scorddetail{
  width: 100%;
  padding: 10px;
}

</style>

